<div class="content">
  <div class="title">
    <!--<a mat-button style="margin-right: 10px" [routerLink]="'/manageArticle'" >文章类型管理</a>-->
    <button mat-button color="primary" class="add-btn" (click)="onOpenAdd()" *ngIf="isAdmin">添加</button>
  </div>
  <div class="grid">
    <table mat-table [dataSource]="forums" [trackBy]="trackById">
      <ng-container matColumnDef="select">
        <th mat-header-cell *matHeaderCellDef>
          <mat-checkbox (change)="$event? allToggle() : null"
                        [checked]="selection.hasValue() && isAllSelected()"
                        [indeterminate]="selection.hasValue() && !isAllSelected()"
          >
          </mat-checkbox>
        </th>
        <td mat-cell *matCellDef="let row">
          <mat-checkbox (change)="$event ? selection.toggle(row): null"
                        (click)="$event.stopPropagation()"
                        [checked]="selection.isSelected(row)">
          </mat-checkbox>
        </td>
      </ng-container>

      <ng-container matColumnDef="title">
        <th mat-header-cell *matHeaderCellDef>文章标题</th>
        <td mat-cell *matCellDef="let row ">{{ row.title }}</td>
      </ng-container>

      <ng-container matColumnDef="content">
        <th mat-header-cell *matHeaderCellDef>文章内容</th>
        <td mat-cell *matCellDef="let row"><a  mat-button routerLink="/forumDetail/{{row.id}}">详情</a></td>
      </ng-container>

      <ng-container matColumnDef="type">
        <th mat-header-cell *matHeaderCellDef>文章类型</th>
        <td mat-cell *matCellDef="let row">{{ row.newsCategory.newsName}}
        </td>
      </ng-container>

      <ng-container matColumnDef="author">
        <th mat-header-cell *matHeaderCellDef>作者</th>
        <td mat-cell *matCellDef="let row">{{ row.author }}</td>
      </ng-container>

      <ng-container matColumnDef="pubdate">
        <th mat-header-cell *matHeaderCellDef>上传时间</th>
        <td mat-cell *matCellDef="let row">{{ row.createDate | date:'yyyy-MM-dd'}}</td>
      </ng-container>

      <ng-container matColumnDef="operate">
        <th mat-header-cell *matHeaderCellDef>操作</th>
        <td mat-cell *matCellDef="let row">
          <button mat-button  (click)="onOpenEdit(row)">编辑</button>
          <button mat-button (click)="onDelete(row.id)">删除</button>

        </td>
      </ng-container>

      <tr mat-header-row *matHeaderRowDef="cols"></tr>
      <tr mat-row *matRowDef="let data; columns: cols"></tr>

    </table>
    <mat-paginator [length]="total"
                   [pageSize]="pageSize"
                   [hidePageSize]="true"
                   (page)="update($event)"></mat-paginator>
  </div>
</div>
